export default {
    namespaced: true,
    state: {
        // 是否显示提示框
        isShowToast: false,
        // 提示内容
        toastMsg: '0',
        // 提示类型
        toastType: 'success' // danger   warning

    },
    mutations: {
        // 修改是否显示提示框
        changeIsShowToast(state, playload) {
            state.isShowToast = playload.isShow;
            if (playload.isShow) {
                state.toastMsg = playload.title,
                    state.toastType = playload.type
            }

        }
    },
    actions: {
        asyncChangeIsShowToast({
            commit
        }, playload) {
            // console.log('111111111');
            commit("changeIsShowToast", playload);
            setTimeout(() => {
                commit('changeIsShowToast', {
                    isShow: false
                })
            }, 1500);
        }
    }
}


/* 
    1. 创建了Toast 组件(基本样式)
    2. 在App.vue中引用组件并使用
    3. 将是否显示,提示内容,类型等数据存储到vuex中
    4. 在Toast组件中使用state数据
    5. 在Login.vue中调用vuex中方法修改提示内容,提示类型,以及显示
    6. 自动隐藏显示框内容,调用vuex中方法,将是否显示设置为false
    7. 增加过渡效果
    8. 在vuex中自动关闭提示框(actions)

*/